<div fxLayout="column" fxFill class="fullscreen color-lightblack">
    <header class="app-header noshrink header-dark">
        <span id="printerdetail-back-btn" class="i-arrow-back margin-l header-icon" (click)="goBack()"></span>
        <span fxFlex="100%" class="margin-l-xs">配置打印机</span>
    </header>
    <div fxLayout="column" class="padding v-scroll">
        <div class="noshrink text-gt-s">
            <div fxLayout="row" fxLayoutAlign="center center">
                <span class="i-check-circle color-accent text-icon-m"></span>
            </div>
            <div fxLayout="column" class="v-gap">
                <span class="margin-t-xs">打印机地址：</span>
                <span class="border-bottom">{{currentPrinter.address}}</span>
            </div>
            <div fxLayout="column" class="v-gap">
                <label class="margin-t-xs">打印机指令：</label>
                <md-select [(ngModel)]="currentInstructionSet">
                    <md-option [value]="instructionSet" *ngFor="let instructionSet of printerManager.instructionSets">
                        <span>{{instructionSet.name}}</span>
                    </md-option>
                </md-select>
            </div>
            <div fxLayout="column" class="v-gap">
                <label class="margin-t-xs">打印纸宽度：</label>
                <md-select [(ngModel)]="currentPageSize">
                    <md-option [value]="selectPageSize" *ngFor="let selectPageSize of printerManager.selectPageSizes">
                        <span>{{selectPageSize.label}}</span>
                    </md-option>
                </md-select>
            </div>
            <div fxLayout="column" class="v-gap">
                <label class="margin-t-xs">尾部走纸行数：</label>
                <md-select [(ngModel)]="currentScrollRow">
                    <md-option [value]="paperScrollRow" *ngFor="let paperScrollRow of printerManager.paperScrollRows">
                        <span>{{paperScrollRow.label}}</span>
                    </md-option>
                </md-select>
            </div>
            <div fxLayout="row" class="v-gap">
                <label fxFlex="100%" class="margin-t-xs">是否带切刀：</label>
                <md-checkbox [(ngModel)]="currentAutoCut"></md-checkbox>
            </div>
        </div>
        <div fxLayout="column" class="noshrink">
            <button class="pct100 content-btn noshrink color-primary border-primary v-gap" (click)="testPrint()">打印测试</button>
            <button class="pct100 content-btn noshrink color-primary border-primary v-gap" (click)="deletePrinter()">删除打印机</button>
            <button class="pct100 bgcolor-primary content-btn color-white noshrink v-gap" (click)="updatePrinter()">保存设置</button>
            <button class="pct100 bgcolor-primary content-btn color-white noshrink v-gap margin-t-xs" (click)="addPrinter()">添加打印机</button>
        </div>
    </div>
</div>